import 'package:flutter/material.dart';

class PaymentScreen extends StatelessWidget {
  const PaymentScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text('支付页面'),
        ),
        body:  Padding(
            padding: EdgeInsets.all(20.0),
            child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                  const Icon(Icons.payment, size: 80, color: Colors.blue),
                  const SizedBox(height: 20),
                  const Text("支付订单",
                      style:
                          TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
                      textAlign: TextAlign.center),
                  const SizedBox(height: 10),
                  const Text(" '订单号: #ORD-20230721-001',",
                      style: TextStyle(fontSize: 16, color: Colors.grey),
                      textAlign: TextAlign.center),
                  const SizedBox(height: 10),
                  const Card(
                    elevation: 3,
                    child: Padding(
                        padding: EdgeInsets.all(16.0),
                        child: Column(
                          children: [
                            Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: [
                                  Text('商品金额', style: TextStyle(fontSize: 16)),
                                  Text('￥1299.00',
                                      style: TextStyle(fontSize: 16)),
                                ]),
                            SizedBox(height: 10),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text('运费', style: TextStyle(fontSize: 16)),
                                Text('¥ 0.00', style: TextStyle(fontSize: 16)),
                              ],
                            ),
                            SizedBox(height: 10),
                            Divider(),
                            SizedBox(height: 10),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text(
                                  '总计',
                                  style: TextStyle(
                                      fontSize: 18,
                                      fontWeight: FontWeight.bold),
                                ),
                                Text('¥ 1299.00',
                                    style: TextStyle(
                                        fontSize: 18,
                                        fontWeight: FontWeight.bold,
                                        color: Colors.red)),
                              ],
                            )
                          ],
                        )),
                  ),
                  const Spacer(),
                  const Text(
                    '请选择支付方式:',
                    style: TextStyle(fontSize: 16,fontWeight: FontWeight.bold),
                  ),
                  const SizedBox(height: 10),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: [
                      _buildPaymentOption(Icons.credit_card, '银行卡'),
                      _buildPaymentOption(Icons.account_balance_wallet, '钱包'),
                      _buildPaymentOption(Icons.qr_code, '扫码'),
                    ],
                  ),
                  const SizedBox(height: 40),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      ElevatedButton(onPressed: ()=>Navigator.pop(context,{'status':'支付成功','ammount':1299.0}),
                          style: ElevatedButton.styleFrom(
                            backgroundColor: Colors.green,
                            foregroundColor: Colors.white,
                            padding: const EdgeInsets.symmetric(horizontal: 30,vertical: 15),
                          ),
                          child:const Text( '支付成功')),
                      const SizedBox(width: 20),
                      ElevatedButton(onPressed: ()=>Navigator.pop(context,{'status':'支付失败','reason':'余额不足'}),
                          style: ElevatedButton.styleFrom(
                            backgroundColor: Colors.red,
                            foregroundColor: Colors.white,
                            padding: const EdgeInsets.symmetric(horizontal: 30,vertical: 15),
                          ),
                          child: const Text('支付失败')),
                    ],
                  ),
                  const SizedBox(height: 20),
                ])));
  }
}

Widget _buildPaymentOption(IconData icon ,String text) {
  return Column(
    children: [
      Container(
        padding: const EdgeInsets.all(15),
        decoration: BoxDecoration(
          color: Colors.blue[50],
          borderRadius: BorderRadius.circular(10),
        ),
        child: Icon(icon,size: 40,color: Colors.blue),
      ),
      const SizedBox(height: 8),
      Text(text,style: const TextStyle(fontSize: 14)),
    ],
  );
}


